<template name="dialoglist">
	<view>
		<view class="constant">
			
			<view class="userlist" v-for="(item, index) in newptlist" :key="index">
				<view class="userleft">
					<image :src="item.groupUsers.pic" mode=""></image>
					<text style="font-size: 28rpx;">{{ item.groupUsers.nickname }}</text>
				</view>
				<view class="userright">
					<view class="shaouser">
						<view class="" style="color: #4e4e4e; font-weight: bold;font-size: 26rpx;">
							<text>还差</text>
							<text style="color: red;">{{ item.num }}</text>
							<text>人</text>
						</view>
						<newtime :item="item"></newtime>
					</view>
					<view class="cantuan" style="margin-left: 30rpx;"><text style="font-size: 28rpx;" @tap="addGroup(item.groupUsers.id)">去拼单</text></view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import newtime from"@/pagesA/components/newtime/newtime.vue"
export default {
	components: {		
		newtime		
	},
	name: 'dialoglist', //组件名称
	props: {},
	data() {
		return {
			newptlist:[],
			spellsize:0
		};
	},
	methods: {
		showSpellList(){
			this.$store.dispatch("showSpellList",{
				id:17
			}).then(res=>{
				this.newptlist = res.data.data
				this.spellsize = res.data.spellsize
			})
		}
		
	},
	created() {
		this.showSpellList()
	}
};
</script>

<style lang="less">
.constant {
	width: 500rpx;
	background-color:#fef9fb;
	width: 100%;
	 padding: 0 20rpx;
	border-radius: 20rpx;
}
.userlist {
	display: flex;
	justify-content: space-between;
	height: 125rpx;
	.userleft {
		display: flex;
		align-items: center;

		image {
			width: 70rpx;
			height: 70rpx;
			border-radius: 50%;
			vertical-align: middle;
			margin-right: 10rpx;
		}
	}
	.userright {
		display: flex;
		justify-content: space-between;
		align-items: center;
		.cantuan {
			width: 150rpx;
			height: 50rpx;
			border-radius: 10rpx;
			background-color: red;
			color: #fff;
			text-align: center;
			margin-left: 18rpx;
		}
	}
}
</style>
